<%--
  Created by IntelliJ IDEA.
  User: RuoLi
  Date: 2023/2/21
  Time: 18:43
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>修改密码</title>
    <script src="<%=request.getContextPath()%>/js/index.js"></script>
    <!-- import CSS -->
    <link rel="stylesheet" href="<%=request.getContextPath()%>/css/index.css">
    <!-- axios -->
    <script src="<%=request.getContextPath()%>/js/axios.js"></script>
    <!-- import Vue before Element -->
    <script src="<%=request.getContextPath()%>/js/vue.js"></script>
    <!-- import JavaScript -->
    <script src="<%=request.getContextPath()%>/js/element-ui.js"></script>
    <link rel="stylesheet" href="<%=request.getContextPath()%>/css/main_user.css"/>
    <link rel="stylesheet" href="<%=request.getContextPath()%>/css/iconfont-ali.css">
    <link rel="stylesheet" href="<%=request.getContextPath()%>/css/fonts/element-icons.ttf">
    <link rel="stylesheet" href="<%=request.getContextPath()%>/css/fonts/element-icons.woff">
    <link rel="stylesheet" href="<%=request.getContextPath()%>/css/iconfont.ttf">
    <link rel="stylesheet" href="<%=request.getContextPath()%>/css/iconfont.woff">
    <link rel="stylesheet" href="<%=request.getContextPath()%>/css/iconfont.woff2">
</head>
<body>
<div id="app">
    <el-page-header @back="goBack" content="修改密码"></el-page-header>
    <el-divider></el-divider>
    <el-row style="margin-top: 20px">
        <el-col :span="12">
            <el-form ref="form" :model="form" label-width="100px">
                <el-row>
                    <el-col :span="15">
                        <el-form-item label="用户邮箱：">
                            <el-input v-model="form.email" placeholder="请输入邮箱" ></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="15">
                        <el-form-item label="新密码：">
                            <el-input show-password v-model="form.password" placeholder="请输入密码"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="15">
                        <el-form-item label="确认密码：">
                            <el-input show-password v-model="form.password_check" placeholder="请确认密码"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col>
                        <el-button @click="updatePwd" type="primary" plain>确定</el-button>
                    </el-col>
                </el-row>
            </el-form>
        </el-col>
    </el-row>
</div>
</body>
<script>
    new Vue({
        el: "#app",
        data() {
            return {
                form: {
                    email: '',
                    password: '',
                    password_check: ''
                }
            }
        },
        methods: {
            goBack() {
                window.location.href = "/online_website/user/main_index.jsp";
            },
            updatePwd() {
                let value1 = this.form.password.trim();
                let value2 = this.form.password_check.trim();
                if (value1 !== value2) {
                    this.$notify.error({
                        title: '错误',
                        message: '输入密码不一致，请重新'
                    });
                    this.form.password = "";
                    this.form.password_check = "";
                } else {
                    if (value1.length < 6 || value2.length < 6) {
                        this.$notify.warning({
                            title: '注意',
                            message: '密码长度不低于6位',
                        });
                    } else {
                        let userAccount = '<%=session.getAttribute("userAccount")%>';
                        axios({
                            url: "/online_website/User/UserUpdatePassword",
                            method: "post",
                            contentType: "application/json",
                            params: {
                                "password": this.form.password,
                                "userEmail": this.form.email,
                                "userAccount": userAccount
                            },
                        }).then((res) => {
                            if (parseInt(res.data) === 1) {
                                this.$notify.success({
                                    title: '成功',
                                    message: '密码修改成功',
                                });
                            } else {
                                this.$notify.error({
                                    title: '出现错误',
                                    message: '密码修改失败',
                                });
                            }
                        })
                    }
                }
            }
        },
        created() {

        }
    })
</script>
</html>
